<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>封装集合</title>
</head>

<body>
  <script>
    // 封装集合类
    function Set() {
      // 属性
      this.items = {}
      // 方法
      // 1.添加方法
      Set.prototype.add = function (value) {
        // 判断当前集合中是否包含重复的元素
        if (this.has(value)) {
          return false
        }
        // 将元素添加到集合中
        this.items[value] = value
        return true
      }
      // 2.has方法
      Set.prototype.has = function (value) {
        return this.items.hasOwnProperty(value)
      }
      // 3.删除方法
      Set.prototype.remove = function (value) {
        // 判断集合中有没有该元素
        if (!this.has(value)) {
          return false
        }
        // 将元素删除
        delete this.items[value]
        return true
      }
      // 4.clear方法
      Set.prototype.clear = function () {
        this.items = {}
      }
      // 5.size方法
      Set.prototype.size = function () {
        return Object.keys(this.items).length
      }
      // 6.返回集合所有的key值
      Set.prototype.values = function () {
        return Object.keys(this.items)
      }

      // 集合间的操作
      // 1.并集
      Set.prototype.union = function (otherSet) {
        // this:集合对象A
        // outherSet:集合对象B
        // 1.1创建新的集合
        const unionset = new Set()
        // 1.2将集合A中所有元素添加到新集合
        let values = this.values()
        for (let i = 0; i < values.length; i++) {
          unionset.add(values[i])
        }
        // 1.3取出B集合中的元素,添加进新集合
        values = otherSet.values()
        for (let i = 0; i < values.length; i++) {
          unionset.add(values[i])
        }

        return unionset
      }
    }

    const seta = new Set()
    const setb = new Set()
    seta.add('a')
    seta.add('b')
    seta.add('c')
    seta.add('d')
    setb.add('1')
    setb.add('2')
    setb.add('3')
    setb.add('4')

    const union = seta.union(setb)
    alert(union.values());



  </script>
</body>

</html>